<template>
<div>
  <input type="text" v-model="inputVal">
  <el-input v-model="inputVal"></el-input>
  <el-autocomplete
    v-model="state"
    :fetch-suggestions="qString"
    @select="select"
  >
  </el-autocomplete>
</div>
</template>

<script>
export default {
components: {},
data() {
return {
  inputVal:"(*^_^*)",
  state:"自动建议的内容",
  mockData:[
          { "value": "三全鲜食（北新泾店）", "address": "长宁区新渔路144号" },
          { "value": "Hot honey 首尔炸鸡（仙霞路）", "address": "上海市长宁区淞虹路661号" },
          { "value": "新旺角茶餐厅", "address": "上海市普陀区真北路988号创邑金沙谷6号楼113" },
          { "value": "泷千家(天山西路店)", "address": "天山西路438号" },
          { "value": "胖仙女纸杯蛋糕（上海凌空店）", "address": "上海市长宁区金钟路968号1幢18号楼一层商铺18-101" },
          { "value": "贡茶", "address": "上海市长宁区金钟路633号" },
          { "value": "豪大大香鸡排超级奶爸", "address": "上海市嘉定区曹安公路曹安路1685号" },
          { "value": "茶芝兰（奶茶，手抓饼）", "address": "上海市普陀区同普路1435号" },
  ]
};
},
methods: {
qString:function(qString,cb){
  let result = this.mockData.filter((v,i)=>{
    return v.value.includes(qString);
  })
  cb(result);
},
select:function(value){
  console.log("目前选择的是:",value);
}
},
}
</script>
<style lang='less' scoped>

</style>